<template>
	<view class="tea-manager-app" style="height: 100%;">
		<view class="main-content" v-show="!teaListDialog.show">
			<view class="head">
				<view class="title" style="display: flex;" @click="teaListDialog.show=true">
					<text style="flex:1">当前茶室：{{currentTeaHouse.name}}</text>
					<image src="../../../static/list-right.png" style="width:30upx;height:30upx;margin-right:20upx;margin-top:5upx;"></image>
				</view>
			</view>
			<view class="content-items">
				<view class="content-item" v-for="(item,key) in listData.items" :key="key" @click="goPage(item.link+'?teaHouseId='+currentTeaHouse.id)">
					<view class="icon">
						<image :src="item.icon" style="width:80upx;height:80upx;margin-top:30upx;" />
					</view>
					<view class="name">
					{{item.name}}
					</view>
				</view>
			</view>
		</view>
		<!--
		<view class="button">确认提交</view>
		-->
		<teaList ref="teaList" v-show="teaListDialog.show" @setTeaHouse="setTeaHouse"></teaList>
	</view>
</template>

<script>
	import wPicker from "@/components/w-picker/w-picker.vue"
	import util from '@/libs/util.js'
	
	import teaList from './list.vue'
		
	export default {
	    data() {
	        return {
				isLogin: false,
				tabItemValue: 0,
				teaListDialog: {
					show: false
				},
				searchOption: {
					keyword: ''
				},
				addDialog: {
					show: false
				},
				currentTeaHouse: {
					id: '',
					name: ''
				},
				teaHouse: {
					items: []
				},
				listData: {
					items: [
						{name: '包厢管理',icon:'../../../static/room.png', 'link': '/pages/tea/room/list'},
						{name: '用户管理',icon:'../../../static/user_manager.png', 'link': '/pages/tea/user/list'},
						{name: '配置管理',icon:'../../../static/config.png', 'link': '/pages/tea/default/config'},
						{name: '设备管理',icon:'../../../static/machine.png', 'link': '/pages/tea/machine/list'},
						{name: '任务管理',icon:'../../../static/task.png', 'link': '/pages/tea/task/list'},
						{name: '用户余额日志',icon:'../../../static/money.png', 'link': '/pages/tea/useMoneyLog/list'},
						{name: '邀请管理',icon:'../../../static/invite.png', 'link': '/pages/tea/invite/list'}
					]
				}
	        }
	    },
		onLoad(params) {
			
			
		},
		onShow() {
			
			if (!global.isLogin()) {
				uni.navigateTo({
					url: "/pages/user/auth/auth"
				})
			}
			
			this.getHouseList();
		},
		components: {
			wPicker,
			teaList
		},
		computed: {
			/*
			dateRangeValue() {
				return [this.homeData.startDate, this.homeData.endDate]
			}
			*/
		},
	    methods: {
			...util,
			initData() {
				var token = uni.getStorageSync('token');
			},
			setTeaHouse(item){
				this.teaListDialog.show = false;
				uni.setStorageSync('teaHouseId',item.teaHouseId);
				uni.setStorageSync('teaHouseName',item.name);
				this.currentTeaHouse.id = item.teaHouseId;
				this.currentTeaHouse.name = item.name;
			},
			showAddDialog() {
				this.goPage("/pages/task/home/positionAdd");
			},
			searchByName(event) {
				let name = event.target.value;
				if (name && name.length > 0) {
					for(let i = 0; i < this.listData.items.length; i++) {
						let index = this.listData.items[i].name.indexOf(name);
						if (index!=-1) {
							this.listData.items[i].show = true;
						} else {
							this.listData.items[i].show = false;
						}
					}
				} else {
					this.setField(this.listData.items, 'show', true);
				}
			},
			getHouseList() {
				this.$api.post('/teaHouse/queryPage',
					{
						pageNO: 1,
						limit: 100
					}
				).then((response) => {
					
					var teaHouseId = uni.getStorageSync('teaHouseId');
					var teaHouseName = uni.getStorageSync('teaHouseName');
					
					if (response.ret===1) {
						if (!teaHouseId) {
							uni.setStorageSync('teaHouseId',response.data[0].teaHouseId);
							uni.setStorageSync('teaHouseName',response.data[0].name);
							this.currentTeaHouse.id = response.data[0].teaHouseId;
							this.currentTeaHouse.name = response.data[0].name;
						} else {
							this.currentTeaHouse.id = teaHouseId;
							this.currentTeaHouse.name = teaHouseName;
						}
						
						this.teaHouse.items = response.data
						
						this.$refs.teaList.setItems(this.teaHouse.items); 
					}
					

				});
			},
			tabClick(item) {
				this.tabItemValue = item.value
				//console.log("tabItem");
				this.getDataList();
			},
			getDataList() {
				uni.showLoading({
					title: '加载中'
				});
				this.$api.post('/app/task/position/list',
					{
						page: 1,
						limit: 100
					}
				).then((response) => {
					//for(let i = 0; i )
					response.data.items = this.setField(response.data.items, 'show', true);
					//console.log(response.data.items);
					this.listData.items = response.data.items
					uni.hideLoading()
				});
			},
			goPage(url) {
				uni.navigateTo({url: url})
			},
			
	    }
	}
</script>

<style lang="scss">
	page{
		height: 100%;
	}
	.tea-manager-app{
		background-color: #F5F4F8;
		height: 100%;
		color:#707070;
		.head{
			padding:20upx;
			background-color: white;
		}
		.content-items{
			display: flex;
			flex-wrap: wrap;
			margin-top:20upx;
			
			.content-item{
				font-size:28upx;
				color:#707070;
				width: 200upx;
				height:200upx;
				
				margin-right:20upx;
				margin-left:20upx;
				margin-bottom:20upx;
				border: 1upx solid #eee;
				background-color: white;
				justify-content: center;
				align-items: center;
				text-align: center;
			}
		}

	}
	
</style>
